<template>
    <div>
        <h2 class="h2"><span>军籍信息表--病故军人遗属</span></h2>
        <div>
            <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="140px" class="demo-ruleForm junjixinxibiao" id="junjixinxibiao" accept-charset="UTF-8">
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="入伍时间：" prop="D001">
                            <el-date-picker v-model="ruleForm.D001" type="date" placeholder="入伍时间"></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="原部队代号：" prop="D003">
                            <el-input v-model="ruleForm.D003" id="D003" placeholder="请输入原部队代号（不填番号）"></el-input>
                        </el-form-item>
                    </el-col> 
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                         <el-form-item label="性别：" prop="D022">
                            <el-radio-group v-model="ruleForm.D022">
                                <el-radio label="男"></el-radio>
                                <el-radio label="女"></el-radio>
                            </el-radio-group>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="民族：" prop="D023">
                            <el-input v-model="ruleForm.D023" id="D023" placeholder="请输入民族"></el-input>
                        </el-form-item>
                    </el-col>  
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="出生日期：" prop="D024">
                            <el-date-picker v-model="ruleForm.D024" type="date" placeholder="出生日期"></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="评定单位：" prop="D027">
                            <el-input v-model="ruleForm.D027" id="D027" placeholder="请输入评定单位"></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="病故军人姓名：" prop="D029">
                            <el-input v-model="ruleForm.D029" id="D029" placeholder="请输入病故军人姓名"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="病故日期：" prop="D030">
                            <el-date-picker v-model="ruleForm.D030" type="date" placeholder="病故日期"></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="12">
                        <el-form-item label="病故认定时间：" prop="D031">
                            <el-date-picker v-model="ruleForm.D031" type="date" placeholder="病故认定时间"></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-form-item>
                        <el-button type="primary" @click="submitForm('ruleForm')">下一步</el-button>
                        <el-button @click="resetForm('ruleForm')">重置</el-button>
                    </el-form-item>
                </el-row>
            </el-form>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return {
            ruleForm: { //默认数据
                D001:'',//入伍时间
                D002:'',//退役时间
                D022:'',//性别
                D023:'',//民族
                D024:'',//出生日期
                D027:'',
            },
            rules: {  //规则
                D001:[
                    { type: 'date', required: true, message: '请选择入伍时间', trigger: 'change' }
                ],
                D002:[
                     { type: 'date', required: true, message: '请选择退役时间', trigger: 'change' }
                ],
                D004:[
                    { required: true, message: '请填写退役证件名称', trigger: 'blur' },
                ],
                D005:[
                    { required: true, message: '请填写退役证件', trigger: 'blur' },
                ],
                D006:[
                    { required: true, message: '请填写退役证件号码', trigger: 'blur' },
                ],
                D022:[
                    { required: true, message: '请填写性别', trigger: 'blur' },
                ],
                D023:[
                    { required: true, message: '请填写民族', trigger: 'blur' },
                ],
                D024:[
                    { type: 'date', required: true, message: '请填写出生日期', trigger: 'change' }
                ],
            },
        }
    },
    methods: {
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    // alert('成功，tuiyishibing!');
                    console.log(this.ruleForm)
                    this.$emit('submitfn',2)
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
        resetForm(formName) {
            this.$refs[formName].resetFields();
        },
        hujisuozaidifnsss(value){
            console.log(value)
            this.hujisuozaidiData = value
        },
        hujisuozaidifnsss2(value){
            console.log(value)
        }
    },
    components:{
        
    }
}
</script>

<style scoped>
.el-row {
    margin-bottom: 20px;
}
.el-row:last-child {
    margin-bottom: 0;
}
</style>